export default {
  // 按钮
  button: {
    attrs: {
      draggable: "true",
      class: "",
      "data-type": "button",
    },
    style: {
      margin: "10px 10px 10px 10px",
      color: "#FFF",
      backgroundColor: "#409EFF",
      fontWeight: 500,
      padding: "12px 20px 12px 20px",
      fontSize: "14px",
      borderRadius: "4px",
      textalign: "center",
      borderWidth: "1px",
      borderColor: "#409EFF",
      borderStyle: "solid",
      position: "absolute",
      "z-index": "1",
    },
    tagName: "button",
    goto: {
      type: "none",
      value: null,
    },
    context: {
      type: "string",
      value: "按钮",
    },
  },
  // 文本
  text: {
    attrs: {
      draggable: "true",
      class: "",
      "data-type": "text",
    },
    style: {
      color: "#409eff",
      margin: "10px 10px 10px 10px",
      position: "absolute",
      "word-break": "break-word",
      width: "48px",
      height: "36px",
      "font-size": "24px",
      "z-index": "1",
    },
    tagName: "div",
    goto: {
      type: "none",
      value: null,
    },
    context: {
      type: "string",
      value: "文本",
    },
  },
  // 图片
  img: {
    attrs: {
      draggable: "true",
      class: "",
      src: require("../../assets/images/img.png"),
      "data-type": "img",
    },
    style: {
      margin: "5px 5px 5px 5px",
      position: "absolute",
      width: "300px",
      height: "200px",
    },
    tagName: "img",
  },
  // 固定盒子
  fixedBox: {
    attrs: {
      class: "",
      "data-type": "fixedBox",
    },
    style: {
      padding: "10px 10px 10px 10px",
      margin: "10px 10px 10px 10px",
      height: "400px",
      position: "relative",
    },
    children: [],
    tagName: "div",
  },
  // 自由盒子
  freeBox: {
    attrs: {
      class: "",
      draggable: "true",
      "data-type": "freeBox",
    },
    style: {
      padding: "10px 10px 10px 10px",
      margin: "10px 10px 10px 10px",
      width: "200px",
      height: "200px",
      position: "absolute",
      borderStyle: "solid",
      borderWidth: "0px",
      "z-index": "99",
    },
    children: [],
    tagName: "div",
  },
  // 多列盒子
  colBox: {
    attrs: {
      class: "",
      "data-type": "colBox",
    },
    style: {
      padding: "10px 10px 10px 10px",
      margin: "10px 10px 10px 10px",
      display: "flex",
      "justify-content": "space-around",
      height: "400px",
    },
    children: [],
    tagName: "div",
  },
  // 高级盒子
  seniorBox: {
    tagName: "div",
    attrs: {
      class: "",
      "data-type": "seniorBox",
    },
    style: {
      padding: "10px 10px 10px 10px",
      margin: "10px 10px 10px 10px",
      height: "400px",
      display: "flex",
      "justify-content": "space-around",
      // "flex-wrap": "wrap",
    },
    num: null,
    children: [],
  },
  // 导航栏
  navMenu: {
    tagName: "el-menu",
    attrs: {
      class: "el-menu--horizontal el-menu el-menu-demo",
      mode: "horizontal",
      "data-type": "navMenu",
    },
    style: {
      display: "flex",
      justifyContent: "space-between",
      padding: "0px 30px 0px 30px",
      position: "initial",
    },
    children: [
      {
        attrs: {
          class: `navMenuImg${new Date().getTime()}`,
          src: require("../../assets/images/img.png"),
          "data-type": "navMenuImg",
        },
        style: {
          "margin-top": "5px",
          width: "90px",
          height: "50px",
        },
        tagName: "img",
      },
      {
        tagName: "el-menu-item",
        attrs: {
          "data-type": "navMenuItem",
          index: "2",
          class: "el-menu-item navMenuItem2",
        },
        style: {
          width: "150px",
          "text-align": "center",
          "font-size": "16px",
          float: "none",
        },
        context: { type: "string", value: "模块1" },
      },
      {
        tagName: "el-submenu",
        attrs: {
          "data-type": "navMenuSub",
          index: "3",
          class: "el-submenu navMenuSub3",
        },
        style: {
          width: "150px",
          "text-align": "center",
          "font-size": "16px",
          float: "none",
        },
        children: [
          {
            tagName: "template",
            slot: "title",
            attrs: {
              "data-type": "navMenuSubText",
              class: "el-submenu__title navMenuSubText3",
            },
            context: { type: "string", value: "模块2" },
          },
          {
            tagName: "el-menu-item",
            attrs: {
              "data-type": "navMenuSubItem",
              index: "3-1",
              class: "el-menu-item navMenuItem3_1",
            },
            context: { type: "string", value: "选项1" },
          },
          {
            tagName: "el-menu-item",
            attrs: {
              "data-type": "navMenuSubItem",
              index: "3-2",
              class: "el-menu-item navMenuItem3_2",
            },
            context: { type: "string", value: "选项2" },
          },
          {
            tagName: "el-menu-item",
            attrs: {
              "data-type": "navMenuSubItem",
              index: "3-3",
              class: "el-menu-item navMenuItem3_3",
            },
            context: { type: "string", value: "选项3" },
          },
        ],
      },
      {
        tagName: "el-menu-item",
        attrs: {
          "data-type": "navMenuItem",
          index: "4",
          class: "el-menu-item navMenuItem4",
        },
        style: {
          width: "150px",
          "text-align": "center",
          "font-size": "16px",
          float: "none",
        },
        context: { type: "string", value: "模块3" },
      },
    ],
  },
  // 轮播图
  carousel: {
    tagName: "el-carousel",
    attrs: {
      height: "100px", //走马灯的高度
      type: "none", //走马灯的类型
      class: "el-carousel el-carousel--horizontal el-carousel--card",
      "data-type": "carousel",
    },
    style: {},
    children: [
      {
        tagName: "el-carousel-item",
        attrs: {
          class: "el-carousel__item  is-animating carouselItem1",
          "data-type": "carouselItem",
        },
        children: [
          {
            attrs: {
              src: require("../../assets/images/img.png"),
              "data-type": "carouselItemImage",
            },
            style: { width: "100%", height: "100%" },
            tagName: "img",
          },
        ],
      },
      {
        tagName: "el-carousel-item",
        attrs: {
          class: "el-carousel__item  is-animating carouselItem1",
          "data-type": "carouselItem",
        },
        children: [
          {
            attrs: {
              src: require("../../assets/images/img.png"),
              "data-type": "carouselItemImage",
            },
            style: { width: "100%", height: "100%" },
            tagName: "img",
          },
        ],
      },
      {
        tagName: "el-carousel-item",
        attrs: {
          class: "el-carousel__item  is-animating carouselItem1",
          "data-type": "carouselItem",
        },
        children: [
          {
            attrs: {
              src: require("../../assets/images/img.png"),
              "data-type": "carouselItemImage",
            },
            style: { width: "100%", height: "100%" },
            tagName: "img",
          },
        ],
      },
      {
        tagName: "el-carousel-item",
        attrs: {
          class: "el-carousel__item  is-animating carouselItem1",
          "data-type": "carouselItem",
        },
        children: [
          {
            attrs: {
              src: require("../../assets/images/img.png"),
              "data-type": "carouselItemImage",
            },
            style: { width: "100%", height: "100%" },
            tagName: "img",
          },
        ],
      },
      {
        tagName: "el-carousel-item",
        attrs: {
          class: "el-carousel__item  is-animating carouselItem1",
          "data-type": "carouselItem",
        },
        children: [
          {
            attrs: {
              src: require("../../assets/images/img.png"),
              "data-type": "carouselItemImage",
            },
            style: { width: "100%", height: "100%" },
            tagName: "img",
          },
        ],
      },
    ],
  },
};
